<%--
  User: zhouyanchao
  Date: 2017/10/27
--%>
<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
	<base href="${BaseContext}">
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>教练课程设置</title>
	<jsp:include page="./include_style.jsp"></jsp:include>
	<style>
		.daytd{
			font-weight: bold;
		}

		.passed{
			background-color: lightgrey;
		}
		.passed.schedued{
			background-color:yellow;
		}
		.unpassed{
			background-color: #d6e9c6;
		}
		.unpassed.schedued{
			background-color:greenyellow;
		}
	</style>
</head>
<body>

<div class="am-g" id="calendarData">



</div>


<div class="am-modal am-modal-no-btn" tabindex="-1" id="dataModal">
	<div class="am-modal-dialog">
		<div class="am-modal-hd">课程信息详情
			<a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
		</div>
		<div class="am-modal-bd" id="modalContent">

		</div>
	</div>
</div>

<jsp:include page="include_script.jsp"></jsp:include>
<script>

	$(function () {
		//默认加载当前月的日历
		initCalendar(0,0,0);
	});

	//初始化日历显示
	function initCalendar(year,month,type) {
		$('#calendarData').load('coach/calendar2.do',{year:year,month:month,type:type},function (result) {
			initTdBind();
		});
	}

	function initTdBind() {
		//弹窗操作
		$('td.daytd').each(function(i){
			//添加监听，点击打开弹窗
			$(this).click(function () {
				dealModalContent2($(this));
			});
		});
	}

	//上一月
	function preMonth(year,month) {
		initCalendar(year,month,-1);
	}

	//下一月
	function nextMonth(year,month) {
		initCalendar(year,month,1);
	}

	//第一种方式,处理不同的td，弹窗显示不同的内容，
	function dealModalContent1(td) {
		//根据td的class内容反推它的状态
		if($(td).hasClass('passed')&&$(td).hasClass('schedued')){
			//过期日期，有课程
			$('#modalContent').html('过期的日期，有课程内容，需要ajax从后台获取，只显示不可编辑');
		}
		if($(td).hasClass('passed')&&!$(td).hasClass('schedued')){
			$('#modalContent').html('过期的日期，没有课程内容，提示没有课程信息即可')
		}
		if($(td).hasClass('unpassed')&&$(td).hasClass('schedued')){
			//过期日期，有课程
			$('#modalContent').html('未过期的日期，有课程内容，需要ajax从后台获取，可编辑');
		}
		if($(td).hasClass('unpassed')&&!$(td).hasClass('schedued')){
			$('#modalContent').html('未过期的日期，没有课程内容，可以添加新的课程内容')
		}
		$('#dataModal').modal('open');
	}

	//第二种方式
	function dealModalContent2(td) {

		$('#modalContent').load('coach/modalinfo.do',{date:$(td).attr('dateStr')});
		$('#dataModal').modal('open');
	}

	function closeModal() {
		$('#dataModal').modal('close');
	}


</script>
</body>
</html>
